import 'package:flutter/material.dart';
import 'package:top_foundation/component/wrap.dart';
import 'package:whale/helper/global/global.dart';
import 'package:whale/helper/utils/util.dart';
import 'package:whale/pages/im/util/image.dart';

import 'index.dart';

class ImInputExpressionPage extends StatelessWidget {
  ImInputExpressionPage({Key? key}) : super(key: key);
  final controller = Get.put(ImInputExpressionController());
  final state = Get.find<ImInputExpressionController>().state;

  Widget buildItemsView(String title,
      {List<String>? items, void Function(int)? onTap}) {
    return isZeroList(items)
        ? Container()
        : Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(title),
              IWrap(
                itemBuilder: (context, index) {
                  var value = items[index];
                  return GestureDetector(
                    onTap: () {
                      if (onTap != null) {
                        onTap(index);
                      }
                    },
                    behavior: HitTestBehavior.translucent,
                    child: Container(
                      alignment: Alignment.center,
                      child: Image.asset(value.imImgPathExpression),
                    ),
                  );
                },
                itemCount: items!.length,
                column: 8,
                spacing: 5.r,
                runSpacing: 5.r,
              ),
            ],
          );
  }

  // 主视图
  Widget _buildView() {
    return Container(
        height: 250,
        padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 20),
        child: ListView(
          children: [
            GetBuilder<ImInputExpressionController>(
              id: 'last',
              builder: (controller) {
                return buildItemsView(
                  '最近使用',
                  items: state.lastItems,
                  onTap: (idx) =>
                      controller.actionLastItem(state.lastNames![idx]),
                );
              },
            ),
            GetBuilder<ImInputExpressionController>(
              id: 'all',
              builder: (controller) {
                return buildItemsView(
                  '所有表情',
                  items: state.items,
                  onTap: controller.actionGridItem,
                );
              },
            ),
          ],
        ));
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<ImInputExpressionController>(
      builder: (_) {
        return SafeArea(
          child: _buildView(),
        );
      },
    );
  }
}
